<template>
    <view class="info ph-40 mt-20 pb-40">
        <u--form labelPosition="left" :model="model" ref="uForm" labelWidth="95" :labelStyle="{ fontSize: 32 }">
            <u-form-item label="企业类型" prop="companyType" borderBottom>
                <u-radio-group v-model="model.companyType" inactiveColor="#DDDDDD" activeColor="#FABB3C" labelSize="16" labelColor="#222222" size="16">
                    <u-radio shape="circle" name="1" label="个体工商户"> </u-radio>
                    <u-radio shape="circle" name="2" label="企业商户"  ></u-radio>
                </u-radio-group>
            </u-form-item>
            <u-form-item label="企业名称" prop="companyName" borderBottom>
                <u--input v-model="model.companyName" border="none" placeholder="请输入营业执照上的名称" fontSize="16" clearable></u--input>
            </u-form-item>
            <u-form-item label="统一社会信用代码" prop="generalCreditCode" borderBottom>
                <u--input v-model="model.generalCreditCode" border="none" placeholder="请输入统一社会信用代码" fontSize="16" clearable></u--input>
            </u-form-item>
            <u-form-item label="企业地址" prop="companyAddress" borderBottom>
                <u--input v-model="model.companyAddress" border="none" placeholder="请输入企业地址" fontSize="16" clearable></u--input>
            </u-form-item>

            <view class="mt-32 fs-32 text-color4 mb-24">营业执照</view>
            <u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic"  :maxCount="1" width="79" height="79">
                <view class="w-158 h-158 f ai-c jc-c b-8 upload">
                    <image src="http://cwht.ricecs.cn/app/novice/add.png" class="w-66 h-66"></image>
                </view>
            </u-upload>
        </u--form>

        <view :style="{ paddingBottom: safeAreaBottom + 'px' }" class="bot w-f" style="z-index: 99">
            <view class="f ai-c ph-40 h-136 jc-s-b">
                <view class="w-327"><u-button text="取消" color="#F5F5F5" shape="circle" @click="toCancel" :customStyle="{ color: '#555555' }"></u-button></view>
                <view class="w-327"><u-button text="下一步" color="#FABB3C" shape="circle" @click="toNext"></u-button></view>
            </view>
        </view>
    </view>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { getUploadUrl } from '@/utils/env';
const model = ref({
	companyName:'',
	generalCreditCode:'',
	companyAddress:'',
	companyType:1,
	licensePictureUrl:'',
});
const fileList = ref<any[]>([]);
// 新增图片
async function afterRead(event: any) {
    // 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
    let lists = [].concat(event.file);
    let fileListLen = fileList.value.length;
    lists.map((item) => {
        fileList.value.push({
            ...item,
            status: 'uploading',
            message: '上传中',
        });
    });
    for (let i = 0; i < lists.length; i++) {
        const result = await uploadFilePromise(lists[i].url);
        let item = fileList.value[fileListLen];
        fileList.value.splice(
            fileListLen,
            1,
            Object.assign(item, {
                status: 'success',
                message: '',
                url: result,
            })
        );
        fileListLen++;
    }
}
function uploadFilePromise(url: string) {
    return new Promise((resolve, reject) => {
        uni.uploadFile({
             url: getUploadUrl(),
            filePath: url,
            name: 'file',
            success: (res) => {
                setTimeout(() => {
                    resolve(JSON.parse(res.data).data);
                }, 1000);
            },
        });
    });
}
function toNext(){
	console.log(model.value.companyType)
	if(fileList.value.length<1){
		uni.showToast({
		    title: '请上传营业执照',
		    icon: 'none',
		});
		return
	}
	model.value.licensePictureUrl = fileList.value[0].url;
	emit('fn', model.value)
}
const emit = defineEmits<{
	    // update:固定写法，后面的变量是父组件中v-model：后面的这个变量
	    (event: 'fn', n: any): void
	}>()

function toCancel(){
	uni.navigateBack()
}
//底部安全距离
const systemInfo = uni.getSystemInfoSync();
let safeArea = systemInfo.safeArea;
let screenHeight = systemInfo.screenHeight;
let safeAreaBottom = screenHeight - safeArea.bottom;
</script>
<style lang="scss" scoped>
.info {
    background: #fff;
    .bot {
        position: fixed;
        left: 0;
        bottom: 0;
        background: #fff;
        border-top: 1px solid #f5f5f5;
    }
    .upload {
        border: 1rpx solid #dddddd;
    }
    .yyzz {
        ::v-deep .u-form-item__body {
            padding: 32rpx 0 !important;
            flex-direction: column !important;
        }
    }
}
</style>
